﻿@using ViewRes
@using DonutMgmtSystemFoundation.Models

@model List<UserAdminActivationModel>
@section Title{
    @Shared.ActivateUsers
}

@section Pagename{
    <i class="settings icon"></i>@Shared.ActivateUsers
}

@section Scripts{
    <script type="text/javascript">
        $(function () {
            $(".ui.blue.button").click(function () {
                var currentButton = $(this);
                if (!currentButton.hasClass("disabled")) {
                    var userId = $(this).attr('data-userId');
                    var data = { userId: userId };
                    $.ajax({
                        type: "POST",
                        dataType: "json",
                        contentType: 'application/json',
                        data: JSON.stringify(data),
                        url: "/Admin/SaveActivation",
                        beforeSend: function () {
                            $("#message-icon").removeClass("red").removeClass("green").removeClass("remove").removeClass("checkmark")
                            $("#message").html("");
                            $("#loader").addClass("active");
                        },
                        success: function updateFields(data) {
                            if (data.Success) {
                                $("#message-icon").addClass("green").addClass("checkmark");
                                // Modificar de no aprobado a aprobado
                                var $trElement = $("#approvedUser_" + userId);
                                $trElement.html("@Admin.Approved");
                                $trElement.parent().removeClass("error");
                                currentButton.addClass("disabled");
                                currentButton.siblings().removeClass("disabled");
                                var approved = $("#approvedPersons").html();
                                $("#approvedPersons").html(Number(approved) + 1);
                            } else {
                                $("#message-icon").addClass("red").addClass("remove");
                            }
                            $("#message").html(data.Message);
                            $('#dimmerContent').dimmer('show');
                        },
                        complete: function () {
                            $("#loader").removeClass("active");
                        }
                    });
                }
            });
            $(".ui.red.button").click(function () {
                var currentButton = $(this);
                if (!currentButton.hasClass("disabled")) {
                    var userId = $(this).attr('data-userId');
                    var data = { userId: userId };
                    var currentButton = $(this);
                    $.ajax({
                        type: "POST",
                        dataType: "json",
                        contentType: 'application/json',
                        data: JSON.stringify(data),
                        url: "/Admin/SaveDeactivation",
                        beforeSend: function () {
                            $("#message-icon").removeClass("red").removeClass("green").removeClass("remove").removeClass("checkmark")
                            $("#message").html("");
                            $("#loader").addClass("active");
                        },
                        success: function updateFields(data) {
                            if (data.Success) {
                                $("#message-icon").addClass("green").addClass("checkmark");
                                // Modificar de aprobado a no aprobado
                                var $trElement = $("#approvedUser_" + userId);
                                $trElement.html("<i class='attention icon'></i>@Admin.NotApproved");
                                $trElement.parent().addClass("error");
                                currentButton.addClass("disabled");
                                currentButton.siblings().removeClass("disabled");
                                var approved = $("#approvedPersons").html();
                                $("#approvedPersons").html(Number(approved) - 1);
                            } else {
                                $("#message-icon").addClass("red").addClass("remove");
                            }
                            $("#message").html(data.Message);
                            $('#dimmerContent').dimmer('show');
                        },
                        complete: function () {
                            $("#loader").removeClass("active");
                        }
                    });
                }
            });
        });
    </script>
}

<table class="ui large seven column table segment">
    <thead>
        <tr>
            <th class="two wide">@Admin.User</th>
            <th class="two wide">@Admin.Email</th>
            <th class="two wide">@Admin.Status</th>
            <th class="one wide">@Admin.Actions</th>
        </tr>
    </thead>
    <tbody>
        @foreach (UserAdminActivationModel aUser in Model)
        {
            <tr class="@(!aUser.Approved ? "error" : "")">
                <td>@aUser.Name</td>
                <td>@aUser.Email</td>
                <td id="approvedUser_@aUser.UserId">
                    @if (aUser.Approved)
                    {
                        @Admin.Approved
                    }
                    else
                    {
                        @:<i class="attention icon"></i>@Admin.NotApproved
                    }

                </td>
                <td>
                    <div class="ui buttons">
                        <input class="ui blue @(aUser.Approved ? "disabled" : "") button" type="button" value="@Admin.Activate" data-userid="@aUser.UserId" />
                        <input class="ui red @(!aUser.Approved ? "disabled" : "") button" type="button" value="@Admin.Deactivate" data-userid="@aUser.UserId" />
                    </div>
                </td>
            </tr>  
        }
    </tbody>
    <tfoot>
        <tr>
            <th>@Model.Count @Admin.People</th>
            <th><span id="approvedPersons">@Model.FindAll(x => x.Approved == true).Count</span> @Admin.PeopleApp</th>
            <th></th>
        </tr>
    </tfoot>
</table>

<!-- Message Dimmer -->
<div class="ui page dimmer" id="dimmerContent">
    <div class="content">
        <div class="center">
            <h2 class="ui inverted icon header">
                <i id="message-icon" class="icon circular inverted emphasized"></i>
                <span id="message"></span>
            </h2>
        </div>
    </div>
</div>

<!-- Loader -->
<div id="loader" class="ui page dimmer">
    <div class="ui large text loader">@Shared.Loading</div>
</div>